<template>
	<view class="bottom_but">
		<input type="text" value="" disabled placeholder="说点什么" v-model="searchName" @click="showCommentInput"/>
		<view class="comment" @click="showCommentList">
			<u-badge absolute :offset="[-10, -28]" :type="'primary'" max="99" :value="replyHit"></u-badge>
			<u-icon style="margin: 0 13px;" name="chat" color="#2979ff" size="28"></u-icon>
		</view>
		<view class=""  @click="like">
			
			<u-icon style="margin: 0 13px;" :name="isLike==1?'thumb-up-fill':'thumb-up'" color="#2979ff" size="28"></u-icon>
		</view>
		<view class="" @click="share">
			<u-icon style="margin: 0 13px;" name="share-square" color="#2979ff" size="28"></u-icon>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			replyHit:{
				type:[String,Number],
				default:0
			}
		},
		data() {
			return {
				searchName:'',
				isLike:0
			};
		},
		methods:{
			showCommentInput(){
				
				this.$emit('showCommentInput',true)
			},
			showCommentList() {
				
				// 点击发送评论,之后输入值置为空
				this.$emit('showCommentList', true)
				
			},
			like(){
				// 页面点赞事件参数传递
				this.isLike=this.isLike==0?1:0
				//this.$emit('like', '页面点赞事件参数传递')
			},
			share(){
				// 分享事件调用
				this.$emit('share', '分享事件调用')
			}
		}
	}
</script>

<style scoped lang="scss">
	page{
		width: 100vw;
		height: 100vh;
	}
	.bottom_but{
		height: 150rpx;
		width: 750rpx;
		position: fixed;
		bottom: 0;
		box-shadow: -2rpx -6rpx 13rpx 0rpx rgba(0, 0, 0, 0.09);
		display: flex;
		align-items: center;
		justify-content: space-around;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		input{
			width: 250rpx;
			height: 60rpx;
			border-radius: 30rpx;
			border: 1rpx solid #2979FF;
			padding-left: 10rpx;
		}
		.comment{
			font-size: 28rpx;
			color: #000;
			    width: 26px;
			    height: 26px;
			position: relative;
			
			background-repeat: round;
			
		}
	}
	
</style>
